<template>
    <orh-trees :treesHead="treesHead" reload  @on-reload="refresh" :hideTitle="hideTitle">
        <Tree :data="trees" slot="trees" :load-data="loadData" @on-select-change="itemChange"></Tree>
        <Select v-model="items" size="small" @on-change="itemsChange" style="width:200px" slot="option">
            <Option v-for="(item,index) in itemList" :value="item.watchlist_id" :key="index">{{ item.watchlist_name.zh?item.watchlist_name.zh:item.watchlist_name.mn }}</Option>
        </Select>
        <orh-sub-table pages :pageDate="pageDate" @on-page-change="queryData" slot="content">
            <Table :columns="columns" :data="data" :loading="tableload" slot="table"></Table> 
        </orh-sub-table>
    </orh-trees>
</template>
                
<script>
export default {
    props: {
        hideTitle: {
            type: Boolean,
            default: true
        }
    },
    components: {
    },
    data () {
        return {
            show:false,
            tableload:false,
            condition: null,
            items: null,
            pageDate: {
                total: 0,
                current_page: 1,
                per_page: 0
            },
            treesHead: {
                title: '选择值班项',
                button: false,
                button_text: '添加按钮'
            },
            data:[],
            trees:[],
            itemList: [],
            columns: [
                {
                    title: '值班细则',
                    align: 'center',
                    render:(h,params)=> {
                        return h('span',params.row.entry_content.zh?params.row.entry_content.zh:params.row.entry_content.mn)
                    }
                },
                {
                    title: '扣分次数',
                    align: 'center',
                    key: 'cont'
                },
            ],
            url:'api/watchlist/v1/admininspecttermcheck/tecbeteacher?dutyteacher=',
            gradesUrl: 'api/watchlist/v1/get/departmentstest/test',
            teacherUrl: 'api/user/v1/get/department/users?department_id=',
            itemUrl: 'api/watchlist/v1/get/watchlistclass/list',
        }
    },
    methods: {
        
        // ==================================================
        // 获取年级组
        // ==================================================
        gradesData(){
            this.$http.get(this.gradesUrl).then(val=>{
                    this.trees = []
                    let datas = JSON.parse(JSON.stringify(val.data))
                    console.log('年级组',datas)
                    datas.forEach(this.gradesHandle)
            })
            .catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
            })
        },
        
        // ==================================================
        // 年级组数据处理
        // ==================================================
        gradesHandle(item,index){
            if(index == 0){
                this.trees.push({
                    title: item.department_name.zh?item.department_name.zh:item.department_name.mn,
                    expand: false,
                    value: item.id,
                    loading: true,
                    state: 1,
                    children: []
                })
                this.teacherData(this.trees[0])
            }else{
                this.trees.push({
                    title: item.department_name.zh?item.department_name.zh:item.department_name.mn,
                    value: item.id,
                    expand: false,
                    loading: false,
                    state: 1,
                    children: []
                })
            }
        },
        
        // ==================================================
        // 获取年级组
        // ==================================================
        teacherData(item){
            this.$http.get(this.teacherUrl + item.value).then(val=>{
                    let datas = JSON.parse(JSON.stringify(val.data))
                    console.log('年级组',datas)
                    datas.forEach((iten,index) => {
                        if(index == 0){
                            item.children.push({
                                title: iten.name.zh?iten.name.zh:iten.name.mn,
                                selected: true,
                                state: 2,
                                value: iten.id
                            })
                            this.condition = iten.id
                            this.queryData()
                        }else{
                            item.children.push({
                                title: iten.name.zh?iten.name.zh:iten.name.mn,
                                state: 2,
                                value: iten.id
                            })
                        }
                    })
                    item.loading = false
                    item.expand = true
            })
            .catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
            })
        },
        
        // ==================================================
        // 树形
        // ==================================================
        loadData (item, callback) {
            this.$http.get(this.teacherUrl + item.value).then(val=>{
                    let datas = JSON.parse(JSON.stringify(val.data))
                    datas.forEach(iten => {
                        item.children.push({
                            title: iten.name.zh?iten.name.zh:iten.name.mn,
                            state: 2,
                            value: iten.id
                        })
                    })
                    item.loading = false
                    item.expand = true
            })
            .catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
            })
        },
        
        // ==================================================
        // 条件查询数据
        // ==================================================
        itemChange(val){
            if(val.length != 0){
                if(val[0].state == 2){
                    this.data = []
                    this.tableload = true
                    this.condition = val[0].value
                    this.queryData()
                }
            }
        },
        
        // ==================================================
        // 条件查询数据
        // ==================================================
        itemsChange(val){
            this.data = []
            this.tableload = true
            this.queryData()
        },

        // ==================================================
        // 刷新数据
        // ==================================================
        refresh(){
            this.tableload = true
            this.queryData()
        },

        // ==================================================
        // 查询数据
        // ==================================================
        queryData(){
            this.$http.get(this.url + this.condition + '&watchlist_id=' + this.items).then(val=>{
               
                    this.data = val.data
                    this.pageDate.total = val.data.length
                    this.pageDate.per_page = val.data.length
                    this.pageDate.current_page = 1
                    this.tableload = false
            })
            .catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
                this.tableload = false  
            })
        },

        // ==================================================
        // 查询值班项数据
        // ==================================================
        itemData(index){
            this.$http.get(this.itemUrl).then(val=>{
                    this.itemList = val.data
                    this.items = this.itemList[0].watchlist_id
            })
            .catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
            })
        },
    },
    mounted(){
        this.itemData()
        this.gradesData()
    },
}
</script>